Skip to content

โœจ Header#10

Merged
jun-0411 merged 4 commits intomainfrom
feat/header-rebased
Jan 2, 2026
Merged

โœจ Header#10
jun-0411 merged 4 commits intomainfrom
feat/header-rebased

Conversation

@young-52
Copy link
Collaborator

@young-52 young-52 commented Jan 1, 2026

๐Ÿ“ ์ž‘์—… ๋‚ด์šฉ

  • ํ™”๋ฉด ์ƒ๋‹จ ํ—ค๋”๋ฅผ ๋””์ž์ธํ•˜์˜€์Šต๋‹ˆ๋‹ค.
  • ํ—ค๋”๋ฅผ ๋””์ž์ธํ•˜๋ฉด์„œ RootLayout์„ ๋ฆฌํŒฉํ† ๋งํ•˜์˜€์Šต๋‹ˆ๋‹ค. ๊ณตํ†ต์ ์ธ ํ™”๋ฉด ๋ฐฐ๊ฒฝ์ƒ‰, ํฌ๊ธฐ ๋“ฑ์€ ๋ ˆ์ด์•„์›ƒ์œผ๋กœ ๋„˜๊ธฐ๊ณ , ๊ฐ ๋ผ์šฐํŠธ์—์„œ๋Š” ํ™”๋ฉด ๋‚ด์˜ ์š”์†Œ ๋ฐฐ์น˜๋งŒ ๊ด€๋ฆฌํ•˜๋„๋ก ํ–ˆ์Šต๋‹ˆ๋‹ค.
  • ๋ฆฌํŒฉํ† ๋ง ๊ณผ์ •์—์„œ ๋กœ๊ทธ์ธ/ํšŒ์›๊ฐ€์ž… ํ™”๋ฉด์˜ ๋””์ž์ธ์ด ์ผ๋ถ€ ์กฐ์ •๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

(์›๋ž˜๋Š” ํ”„๋กœํ•„ ์‚ฌ์ง„ ๊ตฌํ˜„๊นŒ์ง€ ํ•˜๋ ค๊ณ  ํ–ˆ์œผ๋‚˜โ€ฆ ์‚ฌ์ง„์„ JSON์œผ๋กœ ์ƒํ•˜์ฐจํ•˜๋Š” ๋ฐฉ์‹์€ ์˜๋…ผํ•ด๋ด์•ผ ํ•  ๊ฒƒ ๊ฐ™์•„์„œ ์šฐ์„  ์œ ๋ณดํ•ด ๋‘ก๋‹ˆ๋‹ค.)

๐Ÿ“ธ ์Šคํฌ๋ฆฐ์ƒท

pr10-login-snapshot pr10-registerchoice-snapshot

๐Ÿš€ ๋ฆฌ๋ทฐ ์š”๊ตฌ์‚ฌํ•ญ

  • ์•„์ง ์ปค์Šคํ…€ ํ›…์˜ ์‚ฌ์šฉ๋ฒ•์ด ์ต์ง€ ์•Š์•„์„œโ€ฆ ์ ์ ˆํ•˜๊ฒŒ useAuth๋ฅผ ํ™œ์šฉํ•˜๊ณ  ์žˆ๋Š”์ง€ ๋ชจ๋ฅด๊ฒ ์Šต๋‹ˆ๋‹ค.
  • RootLayout.tsx ์ฝ”๋“œ์˜ ๋ฆฌํŒฉํ† ๋ง์„ ์ง„ํ–‰ํ•˜๋ฉด์„œ ๋กœ๊ทธ์ธ/ํšŒ์›๊ฐ€์ž… ํ™”๋ฉด์˜ ๋””์ž์ธ๋„ ์ผ๋ถ€ ๊ฑด๋“œ๋ฆฌ๊ฒŒ ๋˜์—ˆ๋Š”๋ฐ์š”, ํ˜น์‹œ ๋””์ž์ธ์ด ์˜๋„ํ•˜์‹  ๋ฐ”์—์„œ ๋‹ฌ๋ผ์กŒ๋‹ค๋ฉด ๋ฐ˜๋“œ์‹œ ์ˆ˜์ • ์š”์ฒญ ๋ถ€ํƒ๋“œ๋ฆฝ๋‹ˆ๋‹ค!

@young-52 young-52 added this to the Sprint 1 milestone Jan 1, 2026
@young-52 young-52 requested a review from jun-0411 January 1, 2026 22:04
@young-52 young-52 added the enhancement New feature or request label Jan 1, 2026
@young-52 young-52 linked an issue Jan 1, 2026 that may be closed by this pull request
Copy link
Collaborator

@jun-0411 jun-0411 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

๋„ˆ๋ฌด ๋Šฆ๊ฒŒ ํ™•์ธํ•ด์„œ ์ฃ„์†กํ•ฉ๋‹ˆ๋‹ค ใ… ใ… 

1. useAuth ํ•จ์ˆ˜

์•„์ง ์ปค์Šคํ…€ ํ›…์˜ ์‚ฌ์šฉ๋ฒ•์ด ์ต์ง€ ์•Š์•„์„œโ€ฆ ์ ์ ˆํ•˜๊ฒŒ useAuth๋ฅผ ํ™œ์šฉํ•˜๊ณ  ์žˆ๋Š”์ง€ ๋ชจ๋ฅด๊ฒ ์Šต๋‹ˆ๋‹ค.

์•„์ง ์ด๋ฏธ์ง€ ์ฒ˜๋ฆฌ ๋ฐฉ์‹์€ ํ™•์ •์ด ์•„๋‹ˆ์ง€๋งŒ, ๋กœ๊ทธ์ธํ•œ ์œ ์ € ์ •๋ณด๋ฅผ user ์ด๋ฆ„์œผ๋กœ ์ €์žฅํ•ด ๋‘์—ˆ์–ด์š”!

// 1. user ๊ฐ์ฒด๋ฅผ ์ถ”๊ฐ€๋กœ ๊ฐ€์ ธ์˜ต๋‹ˆ๋‹ค.
const { user, isLoggedIn, handleLogout } = useAuth();

// ... (์ค‘๋žต)

{/* avatar UI */}
{user?.photo ? (
  <img src={user.photo} />
) : (
  <span> {user?.name}๋‹˜</span>
)}

์ด๋Ÿฐ ์‹์œผ๋กœ ๋งŒ๋“ค ์ˆ˜ ์žˆ์„ ๊ฒƒ ๊ฐ™์•„์š”.

2. ๋กœ๊ทธ์ธ/ํšŒ์›๊ฐ€์ž… ๋””์ž์ธ ๋ณ€๊ฒฝ

RootLayout.tsx ์ฝ”๋“œ์˜ ๋ฆฌํŒฉํ† ๋ง์„ ์ง„ํ–‰ํ•˜๋ฉด์„œ ๋กœ๊ทธ์ธ/ํšŒ์›๊ฐ€์ž… ํ™”๋ฉด์˜ ๋””์ž์ธ๋„ ์ผ๋ถ€ ๊ฑด๋“œ๋ฆฌ๊ฒŒ ๋˜์—ˆ๋Š”๋ฐ์š”, ํ˜น์‹œ ๋””์ž์ธ์ด ์˜๋„ํ•˜์‹  ๋ฐ”์—์„œ ๋‹ฌ๋ผ์กŒ๋‹ค๋ฉด ๋ฐ˜๋“œ์‹œ ์ˆ˜์ • ์š”์ฒญ ๋ถ€ํƒ๋“œ๋ฆฝ๋‹ˆ๋‹ค!

๋””์ž์ธ์€ ์ž„์‹œ๋กœ ๋งŒ๋“ ๊ฑฐ๋ผ ๋ณ€๊ฒฝํ•˜์…”๋„ ๊ดœ์ฐฎ์Šต๋‹ˆ๋‹ค ใ…Žใ…Ž
๋””์ž์ด๋„ˆ๋ถ„ ์˜ค์‹œ๋ฉด ๋‹ค์‹œ css ์ž‘์—…ํ•˜๋Š”๊ฒŒ ์–ด๋–จ๊นŒ์š”?

๊ธฐํƒ€ ์˜๊ฒฌ

type ์„ ์–ธ ๋ฐฉ์‹

ํŠน๋ณ„ํ•œ ์ด์œ ๋ฅผ ๊ฐ€์ง€๊ณ  type๊ณผ interface๋ฅผ ๊ตฌ๋ถ„ํ•˜๊ณ  ์žˆ์ง€๋Š” ์•Š์•„์š”. ์ €๋„ ํ•˜๋‚˜๋กœ ํ†ต์ผํ•˜๋Š”๊ฒŒ ์ข‹์„ ๊ฒƒ ๊ฐ™๋‹ค๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค!

type์œผ๋กœ ์„ ์–ธํ•˜๋ฉด ์œ ๋‹ˆ์˜จ ํƒ€์ž…์ด๋‚˜ ํŠœํ”Œ ๊ฐ™์€ ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค.
(e.g. type Status = "success" | "error" | "loading"; // ์œ ๋‹ˆ์˜จ ํƒ€์ž…)

interface๋Š” ๊ฐ™์€ ์ด๋ฆ„์œผ๋กœ ์—ฌ๋Ÿฌ ๋ฒˆ ์„ ์–ธํ•˜๋ฉด ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๊ฐ€ ์ž๋™์ ์œผ๋กœ ํ•˜๋‚˜๋กœ ํ•ฉ์ณ์ฃผ๋Š” ๊ธฐ๋Šฅ์ด ์žˆ์–ด ์™ธ๋ถ€ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์‚ฌ์šฉ์— ํŽธ๋ฆฌํ•˜๋‹ค๊ณ  ํ•ฉ๋‹ˆ. ์„ฑ๋Šฅ๋„ ์กฐ๊ธˆ ๋” ์ข‹๋‹ค๊ณ ๋Š” ํ•˜๋„ค์š”?

์ฐพ์•„๋ณด๋‹ˆ๊นŒ ๊ด€์Šต์ ์œผ๋กœ interface๋ฅผ ์‚ฌ์šฉํ•˜๊ณ , "๊ฐ์ฒด๋Š” interface๋กœ, ๊ทธ ์™ธ์˜ ์กฐํ•ฉ ํƒ€์ž…์€ type์œผ๋กœ ์ •์˜" ์ด๋Ÿฐ์‹์œผ๋กœ ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ•๋„ ์žˆ๋‹ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. ํŽธํ•˜์‹  ์ชฝ์œผ๋กœ ํ†ต์ผ๋งŒ ํ•˜๋ฉด ๋  ๊ฒƒ ๊ฐ™์•„์š”!

@jun-0411 jun-0411 merged commit 3fb5727 into main Jan 2, 2026
1 check passed
@jun-0411 jun-0411 deleted the feat/header-rebased branch January 2, 2026 16:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

โœจ Header

2 participants